<template>
    <div class="consult">
      <el-row>
        <el-col :span="6">
          <div :style="{ height: heightCard }">
            <div style="height: 50px; margin: 10px">
              <el-radio-group
                size="medium"
                v-model="activeName"
                style="margin-bottom: 30px"
              >
                <el-radio-button label="a" @click.native="handleClickTabs('a')"
                  >机构类</el-radio-button
                >
                <el-radio-button label="b" @click.native="handleClickTabs('b')"
                  >人员类</el-radio-button
                >
                <el-radio-button label="c" @click.native="handleClickTabs('c')"
                  >班子类</el-radio-button
                >
              </el-radio-group>
              <el-button
                style="float: right"
                size="medium"
                type="primary"
                plain
                @click="addTagGroup(2)"
                >新增</el-button
              >
            </div>
            <!-- 机构类 -->
            <div class="organization">
              <el-tree
                ref="tree"
                :data="categories"
                node-key="id"
                @node-click="handleNodeClick"
                :default-expand-all="false"
                :props="defaultProps"
                :expand-on-click-node="false"
              >
                <span class="custom-tree-node" slot-scope="{ node, data }">
                  <span style="display: inline-block">{{ node.label }}</span>
                  <span style="display: inline-block; margin-right: 30px">
                    <el-button
                      type="primary"
                      plain
                      round
                      @click="() => openAddNodeDialog(data)"
                    >
                      <i class="el-icon-plus"></i>
                    </el-button>
                    <el-button
                      type="danger"
                      plain
                      round
                      @click="groupDel(data, 2)"
                    >
                      <i class="el-icon-delete"></i>
                    </el-button>
                  </span>
                </span>
              </el-tree>
            </div>
            <!-- 人员类 -->
            <div class="person">
              <el-tree
                ref="tree"
                :data="categories"
                node-key="id"
                @node-click="handleNodeClick"
                :default-expand-all="false"
                :props="defaultProps"
                :expand-on-click-node="false"
              >
                <span class="custom-tree-node" slot-scope="{ node, data }">
                  <span style="display: inline-block">{{ node.label }}</span>
                  <span style="display: inline-block; margin-right: 30px">
                    <el-button
                      type="primary"
                      plain
                      round
                      @click="() => openAddNodeDialog(data)"
                    >
                      <i class="el-icon-plus"></i>
                    </el-button>
                    <el-button
                      type="danger"
                      plain
                      round
                      @click="groupDel(data, 2)"
                    >
                      <i class="el-icon-delete"></i>
                    </el-button>
                  </span>
                </span>
              </el-tree>
            </div>
            <!-- 班子类 -->
            <div class="team">班子</div>
          </div>
        </el-col>
        <el-col
          :span="18"
          class="organizationTable"
          style="overflow-y: scroll"
          :style="{ height: heightCard }"
        >
          <el-card class="box-card" style="height: 500px">
            <div
              style="
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin: 20px 20px 10px 20px;
              "
            >
              <h4>标签定义:</h4>
              <div>
                <el-button
                  type="primary"
                  size="medium"
                  plain
                  @click="addTagGroup(3)"
                  >新增</el-button
                >
              </div>
            </div>
            <div style="padding: 0 20px 0 20px">
              <vxe-table
                border
                ref="xTable"
                :resizable="true"
                :align="allAlign"
                :data="tags"
                :height="heightTableTag"
                :scroll-y="{ enabled: false }"
                highlight-current-row
              >
                <vxe-column title="序号" type="seq" width="60"></vxe-column>
                <vxe-column title="定义名" field="tagName"></vxe-column>
                <vxe-column title="code值" field="tagCode"></vxe-column>
                <vxe-column title="排序" field="tagSort"></vxe-column>
                <vxe-column title="操作">
                  <template slot-scope="scope">
                    <el-button
                      type="danger"
                      size="medium"
                      plain
                      @click="tagRequirementDelete(scope.row)"
                      >删除</el-button
                    >
                  </template>
                </vxe-column>
              </vxe-table>
            </div>
          </el-card>
          <el-card class="box-card" style="overflow-y: scroll">
            <div style="display: flex; justify-content: flex-end; padding: 10px">
              <el-button
                type="primary"
                size="medium"
                plain
                @click="handleClickTableAdd()"
                >新增</el-button
              >
              <el-button type="danger" size="medium" plain @click="tableDel"
                >删除</el-button
              >
            </div>
            <div
              style="
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin: 20px 20px 0 20px;
              "
            >
              <h4>条件定义:</h4>
              <span style="color: red">多个比较值使用|分割</span>
            </div>
            <div style="padding: 0 20px 0 20px">
              <vxe-table
                border
                ref="xTable"
                :resizable="true"
                :align="allAlign"
                :data="tableData"
                :height="heightTable"
                :scroll-y="{ enabled: false }"
                highlight-current-row
                @current-change="handleCurrentRow"
              >
                <!-- show-overflow -->
                <vxe-column width="60" align="center">
                  <template #default>
                    <span class="drag-btn">
                      <i class="vxe-icon--menu"></i>
                    </span>
                  </template>
                </vxe-column>
                <vxe-column title="序号" type="seq" width="60"></vxe-column>
                <vxe-column title="表名" field="tabName">
                  <template slot-scope="scope">
                    <el-select
                      ref="produceRef"
                      v-model="scope.row.tabName"
                      placeholder="请选择"
                      clearable
                      @change="tableNameChang($event, scope.row)"
                    >
                      <el-option
                        v-for="item in nameOption"
                        :key="item.tableName"
                        :label="item.tableShowName"
                        :value="item.tableName"
                      >
                      </el-option>
                    </el-select>
                  </template>
                </vxe-column>
                <vxe-column title="字段" field="tagField">
                  <template slot-scope="scope">
                    <tagOperatorField
                      v-model="scope.row.tagField"
                      :row="scope.row"
                      @change="handleTagOperator($event, scope.row)"
                    />
                  </template>
                </vxe-column>
                <vxe-column title="比较符" field="tagOperator">
                  <template slot-scope="scope">
                    <el-select
                      @change="$forceUpdate()"
                      v-model="scope.row.tagOperator"
                      placeholder="请选择"
                      clearable
                    >
                      <el-option
                        v-for="item in comparisonOptions"
                        :key="item.CODE"
                        :label="item.NAME"
                        :value="item.CODE"
                      >
                      </el-option>
                    </el-select>
                  </template>
                </vxe-column>
                <vxe-column field="tagCondition" title="比较值">
                  <template slot-scope="scope">
                    <custum-type
                      v-model="scope.row.tagCondition"
                      :row="scope.row"
                      @change="handleConditionChange($event, scope.row)"
                    />
                  </template>
                </vxe-column>
              </vxe-table>
            </div>
            <div
              style="
                display: flex;
                justify-content: center;
                align-items: center;
                margin-top: 30px;
              "
            >
              查询条件运算方式：<el-input
                size="medium"
                v-model="searchOperate"
                style="width: 500px"
                @change="inputValue"
              />
            </div>
            <p style="color: red; display: flex; justify-content: center">
              编写条件定义的运算逻辑。如:同时满足条件1和2，然后在满足条件3，输入框填写<br />(1+2)+3。同表之间使用括号包裹
            </p>
            <div
              style="display: flex; justify-content: flex-end; margin-right: 30px"
            >
              <el-button
                type="primary"
                size="medium"
                @click="onSubmitInput"
                :disabled="isButtonDisabled"
                >保存</el-button
              >
            </div>
          </el-card>
        </el-col>
        <el-col
          :span="18"
          class="personTable"
          style="overflow-y: scroll"
          :style="{ height: heightCard }"
        >
          <personnelTag />
        </el-col>
        <el-col
          :span="18"
          class="teamTable"
          style="overflow-y: scroll"
          :style="{ height: heightCard }"
        >
          <el-card class="box-card" style="overflow-y: scroll"> 班子 </el-card>
        </el-col>
      </el-row>
      <tagAddDialog
        ref="tagAddDialogRefs"
        v-if="tagAddDialogFlag"
        @initData="getConsultList"
        @on-group-add-success="handleGroupAddSuccess"
      />
      <tagUpdateDialogFrist
        ref="tagUpdateDialogFristRefs"
        v-if="tagUpdateDialogFristFlag"
        @initData="getConsultList"
        @on-group-add-success="handleGroupAddSuccess"
      />
      <tagButtonClickEvent
        ref="tagButtonClickEventRefs"
        :list="tableData"
        @addData="handleClickTableAdd"
        v-if="tagButtonClickEventFlag"
      />
      <el-dialog
        title="新增子节点"
        :visible.sync="dialogVisible"
        width="30%"
        :close-on-click-modal="false"
        :before-close="handleClose"
      >
        <div>
          <el-form
            :label-position="labelPosition"
            label-width="80px"
            :model="formLabelAlign"
            ref="myForm"
          >
            <el-form-item
              label="名称"
              prop="tagName"
              :rules="[
                {
                  required: true,
                  message: '名称不能为空',
                  trigger: 'blur',
                },
              ]"
            >
              <el-input v-model="formLabelAlign.tagName"></el-input>
            </el-form-item>
            <el-form-item
              label="code值"
              prop="tagCode"
              :rules="[
                {
                  required: true,
                  message: 'code值为英文和数字',
                  trigger: 'blur',
                },
                { validator: validateCode, trigger: 'blur' },
              ]"
            >
              <el-input v-model="formLabelAlign.tagCode"></el-input>
            </el-form-item>
            <el-form-item
              label="排序"
              prop="tagSort"
              :rules="[
                {
                  required: true,
                  message: '排序值不能为空',
                  trigger: 'blur',
                },
                { validator: validateSort, trigger: 'blur' },
              ]"
            >
              <el-input v-model="formLabelAlign.tagSort"></el-input>
            </el-form-item>
          </el-form>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="onSubmitTagDefine">确 定</el-button>
        </span>
      </el-dialog>
    </div>
  </template>
    
  <script>
  import tagAddDialog from "./componentsConsult/tagAddDialogFrist.vue";
  import tagUpdateDialogFrist from "./componentsConsult/tagUpdateDialogFrist";
  import tagButtonClickEvent from "./componentsConsult/tagButtonClickEvent.vue";
  import CustumType from "./componentsConsult/custumType.vue";
  import tagOperatorField from "./componentsConsult/tagOperatorField.vue";
  import appendGroupAdd from "./componentsConsult/appendGroupAdd";
  import personnelTag from "./personnelTag";
  import Sortable from "sortablejs";
  import {
    consultList,
    tagDefineDelete,
    queryDict,
    tagTableAndColumnConfigList,
    tagRequirementList,
    saveTagRequirementEdit,
    tagRequirementDelete,
    tagDefineEdit,
  } from "@/api/students/organization/consult";
  import store from "@/store";
  export default {
    components: {
      tagAddDialog,
      tagUpdateDialogFrist,
      tagButtonClickEvent,
      CustumType,
      tagOperatorField,
      appendGroupAdd,
    },
    data() {
      return {
        activeName: "a",
        heightCard: window.innerHeight - 132 + "px",
        heightTable: window.innerHeight - 450 + "px",
        heightTableTag: window.innerHeight - 600 + "px",
        tagGroups: [],
        categories: [],
        tags: [],
        categoriesList: null,
        groupData: null,
        tagsRow: null,
        allAlign: "center",
        tableData: [],
        nameOption: [],
        fieldOptions: [],
        comparisonOptions: [],
        selectedGroupIndex: 0,
        selectedCategoryIndex: 0,
        selectTagsIndex: 0,
        tagAddDialogFlag: false,
        tagUpdateDialogFristFlag: false,
        tagButtonClickEventFlag: false,
        currentRow: null,
        searchOperate: "",
        inputId: "",
        inputTagDefineId: "",
        inputTagFormula: "",
        tagsClickList: null,
        fieldValues: "",
        typeTagCondition: "",
        tagConditionOption: [], //比较符数组
        isButtonDisabled: false, // 按钮是否被禁用
        timer: null, // 定时器变量
        searchOperateValue: "",
        tagSorts: "",
        tableDataList: [],
        defaultProps: {
          children: "children",
          label: "tagName",
        },
        tabName: "a",
        appendGroupAddFlag: false,
        dialogVisible: false,
        labelPosition: "right",
        formLabelAlign: {
          tagName: "",
          tagCode: "",
          tagSort: "",
        },
        newChild: [],
        dataRow: null,
      };
    },
    computed: {
      currentGroup() {
        return this.tagGroups[this.selectedGroupIndex];
      },
      currentCategory() {
        return this.currentGroup.categories[this.selectedCategoryIndex]; // 默认显示第一个分类
      },
    },
    watch: {
      // "node.data.children": function (newChildren, oldChildren) {
      //   console.log(newChildren, oldChildren, "newol");
      //   if (typeof newChildren === "object") {
      //     // 在这里执行您的操作，例如更新视图或者其他逻辑
      //   } else {
      //     // 如果 newChildren 不是对象，则不执行操作，或者进行其他处理
      //   }
      // },
    },
    created() {
      this.rowDrop();
      this.getConsultList();
      this.queryDict();
      this.tableNameList();
      this.tabName = "a";
      // this.handleGroupClick();
    },
    beforeDestroy() {
      if (this.sortable) {
        this.sortable.destroy();
      }
    },
    methods: {
      validateCode(rule, value, callback) {
        if (!/^[a-zA-Z0-9]*$/.test(value)) {
          callback(new Error("请输入正确的code值"));
        } else {
          // 校验通过时手动调用callback()来清除错误提示
          callback();
        }
      },
      validateName(rule, value, callback) {
        if (!/^[\u4e00-\u9fa5]*$/.test(value)) {
          callback(new Error("请输入正确的名称"));
        } else {
          callback();
        }
      },
      validateSort(rule, value, callback) {
        if (!/^[0-9]*$/.test(value)) {
          callback(new Error("请输入正确的排序值"));
        } else {
          callback();
        }
      },
      handleClose() {
        const form = this.$refs.myForm;
  
        // 确保form实例存在并调用resetFields方法
        if (form && typeof form.resetFields === "function") {
          form.resetFields();
        }
        this.dialogVisible = false;
      },
      handleClickTabs(type) {
        this.tabName = type;
        if (this.tabName == "a") {
          // 选择所有类名为"name"的元素
          let elementsOrganization = document.querySelector(".organization");
          elementsOrganization.style.display = "block";
          let elementsPerson = document.querySelector(".person");
          elementsPerson.style.display = "none";
          let elementsTeam = document.querySelector(".team");
          elementsTeam.style.display = "none";
          let organizationTable = document.querySelector(".organizationTable");
          organizationTable.style.display = "block";
          let personTable = document.querySelector(".personTable");
          personTable.style.display = "none";
          let teamTable = document.querySelector(".teamTable");
          teamTable.style.display = "none";
        } else if (this.tabName == "b") {
          let elementsPerson = document.querySelector(".person");
          elementsPerson.style.display = "block";
          let elementsOrganization = document.querySelector(".organization");
          elementsOrganization.style.display = "none";
          let elementsTeam = document.querySelector(".team");
          elementsTeam.style.display = "none";
          let personTable = document.querySelector(".personTable");
          personTable.style.display = "block";
          let organizationTable = document.querySelector(".organizationTable");
          organizationTable.style.display = "none";
          let teamTable = document.querySelector(".teamTable");
          teamTable.style.display = "none";
        } else if (this.tabName == "c") {
          let elementsTeam = document.querySelector(".team");
          elementsTeam.style.display = "block";
          let elementsPerson = document.querySelector(".person");
          elementsPerson.style.display = "none";
          let elementsOrganization = document.querySelector(".organization");
          elementsOrganization.style.display = "none";
          let teamTable = document.querySelector(".teamTable");
          teamTable.style.display = "block";
          let personTable = document.querySelector(".personTable");
          personTable.style.display = "none";
          let organizationTable = document.querySelector(".organizationTable");
          organizationTable.style.display = "none";
        }
      },
      // 弹框的保存
      onSubmitTagDefine() {
        const params = {
          parentId: this.dataRow.id,
          tagGroupId: this.tabName,
          userId: store.getters.user_id.toString(),
          token: store.getters.token.toString(),
          tagName: this.formLabelAlign.tagName,
          tagCode: this.formLabelAlign.tagCode,
          tagSort: this.formLabelAlign.tagSort,
          tagType: 2,
        };
        tagDefineEdit(params).then((result) => {
          console.log(result, "result");
          this.newChild = result;
          // 在成功保存数据后调用appendGroup方法
          // debugger;
          // this.appendGroup(this.dataRow);
          this.dialogVisible = false;
          //调用这个事件，刷新整体的数据，然后新增的子节点就消失了
          // this.getConsultList();
          const params = {
          userId: store.getters.user_id.toString(),
          userName: store.getters.userName.toString(),
          token: store.getters.token.toString(),
          parentId: this.groupData.id,
          tagGroupId: this.tabName,
          tagType: "2",
        };
          consultList(params).then((result) => {
            debugger
          this.categories = result.resultdata.data;
          // 在this.categories数据中给每个新增的数据添加一个或多个children
          console.log(this.categories, "categories");
        });
        });
      },
      openAddNodeDialog(data) {
        this.dataRow = data;
        this.dialogVisible = true;
        this.clear();
      },
      // 新增树子节点
      appendGroup(data) {
        debugger;
        console.log(data, "data");
        // this.dataRow = data;
        // this.clear();
        // this.dialogVisible = true;
        if (!data.children) {
          // 使用Vue.set或this.$set来添加children属性
          this.$set(data, "children", []);
        }
        // 将新的子节点数据添加到children数组中
        data.children.push(this.newChild);
        data.children = Array.from(new Set(data.children));
        console.log(data.children, "data.children");
      },
      clear() {
        this.formLabelAlign.tagName = "";
        this.formLabelAlign.tagCode = "";
        this.formLabelAlign.tagSort = "";
      },
  
      // 条件定义的新增
      handleClickTableAdd(newData = { id: "" }) {
        this.tagButtonClickEventFlag = true;
        this.$nextTick(() => {
          this.$refs.tagButtonClickEventRefs.init();
        });
        newData.tagSort = this.tableData.length;
        // this.tagSorts = newData.tagSorts;
        this.tableData.push(newData);
        this.tableDataList = this.tableData;
        console.log(this.tableData, "tabledata");
      },
      tableNameChang(value, row) {
        this.$set(row, "tabName", value);
      },
  
      // 表名
      tableNameList() {
        const params = {
          userId: store.getters.user_id.toString(),
          userName: store.getters.userName.toString(),
          token: store.getters.token.toString(),
          type: "1",
        };
        tagTableAndColumnConfigList(params).then((res) => {
          this.nameOption = res.resultdata;
        });
      },
      // 比较符
      queryDict() {
        const params = {
          userId: store.getters.user_id.toString(),
          userName: store.getters.userName.toString(),
          token: store.getters.token.toString(),
        };
        queryDict(params).then((res) => {
          this.comparisonOptions = res.resultdata;
        });
      },
      // 默认展示的数据
      getConsultList() {
        const params = {
          userId: store.getters.user_id.toString(),
          userName: store.getters.userName.toString(),
          token: store.getters.token.toString(),
          parentId: "-1",
          tagType: "1",
        };
        consultList(params).then((result) => {
          this.tagGroups = result.resultdata.data;
          if (this.tagGroups.length > 0) {
            this.handleGroupClick(this.tagGroups[0], 0); // 获取第一条标签分组数据
          }
        });
      },
      // 点击标签分组
      handleGroupClick(groupData, index) {
        this.groupData = groupData;
        const params = {
          userId: store.getters.user_id.toString(),
          userName: store.getters.userName.toString(),
          token: store.getters.token.toString(),
          parentId: this.groupData.id,
          tagGroupId: this.tabName,
          tagType: "2",
        };
        consultList(params).then((result) => {
          this.categories = result.resultdata.data;
          // 在this.categories数据中给每个新增的数据添加一个或多个children
          console.log(this.categories, "categories");
        });
        this.selectedGroupIndex = index;
        this.selectedCategoryIndex = 0; // 将标签分类下标设置为0
        this.selectTagsIndex = 0; // 将标签定义下标设置为0
      },
      // 点击标签分类
      handleNodeClick(data, categoryIndex) {
        this.categoriesList = data;
        const params = {
          userId: store.getters.user_id.toString(),
          userName: store.getters.userName.toString(),
          token: store.getters.token.toString(),
          parentId: this.categoriesList.id,
          tagType: "2",
        };
        consultList(params).then((result) => {
          this.tags = result.resultdata.data;
          if (this.tags.length > 0) {
            this.handleTagClick(this.tags[0], 0); // 展示第一条标签定义数据
          }
        });
        this.selectedCategoryIndex = categoryIndex;
      },
      // 点击标签定义
      handleTagClick(tags, tagsIndex) {
        this.tagsClickList = tags;
        this.selectTagsIndex = tagsIndex;
        this.searchOperate = "";
        this.getTableList();
      },
      // 新增
      addTagGroup(type) {
        console.log(type, "type");
        this.tagAddDialogFlag = true;
        this.$nextTick(() => {
          this.$refs.tagAddDialogRefs.init(
            type,
            this.groupData,
            this.categoriesList,
            this.tabName
          );
        });
      },
      // 修改
      groupUpdate(type, data) {
        this.tagUpdateDialogFristFlag = true;
        this.$nextTick(() => {
          this.$refs.tagUpdateDialogFristRefs.init(
            type,
            data,
            this.groupData,
            this.categoriesList
          );
        });
      },
      // 获取表格数据
      getTableList() {
        const params = {
          userId: store.getters.user_id.toString(),
          userName: store.getters.userName.toString(),
          token: store.getters.token.toString(),
          tagDefineId: this.tagsClickList.id,
          tagFormula: this.searchOperate,
        };
        tagRequirementList(params).then((result) => {
          this.tableData = result.resultdata.data; //表格
          if (result.resultdata.tagOperation) {
            this.inputId = result.resultdata.tagOperation.id || "";
            this.searchOperate = result.resultdata.tagOperation.tagFormula || "";
          } else {
            this.inputId = "";
            this.searchOperate = "";
          }
        });
      },
      inputValue() {
        if (this.searchOperate == null || this.searchOperate.trim() == "") {
          this.$message.warning("运算公式不可为空！");
          this.isButtonDisabled = true; // 输入为空时禁用保存按钮
        } else {
          this.isButtonDisabled = false; //合法时解除禁用
        }
        //验证公式合法性
        if (this.formulaJudge(this.searchOperate)) {
          let rowIndex = this.searchOperate.replace(/[^0-9]/gi, "");
          let points = rowIndex.split("");
          points.sort(function (a, b) {
            return b - a;
          });
          if (points[0] > this.tableData.length) {
            this.$message.warning(
              "运算公式中的最大值超过条件个数，请检查后重试！"
            );
            this.isButtonDisabled = true; // 公式不合法时禁用保存按钮
          } else {
            this.isButtonDisabled = false; //合法时解除禁用
          }
          this.tableDataList;
          // this.onSubmitInput();
        } else {
          this.$message.warning("运算公式不合法，请检查后重试！");
          this.isButtonDisabled = true; // 公式不合法时禁用保存按钮
        }
      },
  
      // 删除
      groupDel(group, type) {
        this.$confirm("确定删除当前行?", "操作提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(() => {
          const params = {
            userId: store.getters.user_id.toString(),
            userName: store.getters.userName.toString(),
            token: store.getters.token.toString(),
            id: group.id,
            type: type,
          };
          tagDefineDelete(params).then((response) => {
            if (response.resultdata) {
              this.$message({
                type: "success",
                message: response.resultdata,
              });
              this.getConsultList();
            } else {
              this.$message({
                type: "error",
                message: response.resultdata,
              });
            }
          });
        });
      },
      // 表格删除
      tableDel() {
        if (this.currentRow !== null) {
          this.$confirm("确定删除当前行?", "操作提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }).then(() => {
            const params = {
              userId: store.getters.user_id.toString(),
              userName: store.getters.userName.toString(),
              token: store.getters.token.toString(),
              id: this.currentRow.id,
            };
            tagRequirementDelete(params).then((response) => {
              if (response.result) {
                this.$message({
                  type: "success",
                  message: response.resultdata,
                });
                this.getTableList();
              } else {
                this.$message({
                  type: "error",
                  message: response.resultdata,
                });
              }
            });
          });
        } else {
          this.$message({
            type: "warning",
            message: "请选中一条数据进行删除",
          });
        }
      },
      // 运算方式的删除
      tagRequirementDelete(tag) {
        this.$confirm("确定删除当前行?", "操作提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(() => {
          const params = {
            userId: store.getters.user_id.toString(),
            userName: store.getters.userName.toString(),
            token: store.getters.token.toString(),
            id: tag.id,
            tagDefineId: tag.id,
            all: "1",
            type: "3",
          };
          tagRequirementDelete(params).then((response) => {
            if (response.result == true) {
              this.$message({
                type: "success",
                message: response.resultdata,
              });
              this.getConsultList();
            } else {
              this.$message({
                type: "error",
                message: response.resultdata,
              });
            }
          });
        });
      },
      handleCurrentRow(currentRow) {
        this.currentRow = currentRow.row;
      },
      // 字段
      handleTagOperator(e, row) {
        const { val, item } = e;
        this.$set(row, "tagField", val);
        this.$set(row, "tfieldType", item.fieldType);
        row["tdictCode"] = item.dictCode;
        this.$set(row, "tdictCode", item.dictCode);
        // 只要选择了，这个字段类型就把 比较值清空，因为可能类型都不一样
        // this.$set(row, "tagCondition", "");
      },
      // 比较值
      handleConditionChange(e, row) {
        this.$set(row, "tagCondition", e);
      },
      //验证公式合法性
      formulaJudge(string) {
        //去除左边及右边的括号（这个是我的公式里面有特殊字符）
        let str = string.replace("{", "").replace("}", "");
        // 剔除空白符
        string = str.replace(/\s/g, "");
        // 错误情况，空字符串
        if ("" === string) {
          return false;
        }
        // 检查数字是否重复出现
        if (/(\d).*\1/.test(string)) {
          return false;
        }
        // 包含非法字符（只允许数字、+、-、(、)，括号为英文括号）
        if (!/^[\d\+\-\(\)]+$/.test(string)) {
          return false;
        }
        // 错误情况，运算符连续
        if (/[\+\-\*\/]{2,}/.test(string)) {
          return false;
        }
        // 空括号
        if (/\(\)/.test(string)) {
          return false;
        }
        // 最后一个符号是加、减、乘、除符号
        if (/[\+\-\*\/]$/.test(string)) {
          return false;
        }
        // 错误情况，括号不配对
        let stack = [];
        for (let i = 0, item; i < string.length; i++) {
          item = string.charAt(i);
          if ("(" === item) {
            stack.push("(");
          } else if (")" === item) {
            if (stack.length > 0) {
              stack.pop();
            } else {
              return false;
            }
          }
        }
        if (0 !== stack.length) {
          return false;
        }
        // 错误情况，(后面是运算符
        if (/\([\+\-\*\/]/.test(string)) {
          return false;
        }
        // 错误情况，)前面是运算符
        if (/[\+\-\*\/]\)/.test(string)) {
          return false;
        }
        // 错误情况，(前面不是运算符
        if (/[^\+\-\*\/\(]\(/.test(string)) {
          return false;
        }
        // 错误情况，)后面不是运算符
        if (/\)[^\+\-\*\/\)]/.test(string)) {
          return false;
        }
        // **错误情况最后一个字符是**+-*/
        if (/\*[\+\-\*\/]$/.test(string)) {
          return false;
        }
        return true;
      },
  
      rowDrop() {
        this.$nextTick(() => {
          let xTable = this.$refs.xTable;
          this.sortable = Sortable.create(
            xTable.$el.querySelector(".body--wrapper>.vxe-table--body tbody"),
            {
              handle: ".vxe-body--row",
              animation: 150,
              onEnd: ({ newIndex, oldIndex }) => {
                // 解决方案
                this.tableData.splice(
                  newIndex,
                  0,
                  this.tableData.splice(oldIndex, 1)[0]
                );
                // 更新tagSort值
                this.tableData.forEach((item, index) => {
                  item.tagSort = index;
                });
                var newArray = this.tableData.slice(0);
                this.tableData = [];
                this.$nextTick(function () {
                  this.tableData = newArray;
                });
              },
            }
          );
        });
      },
      // input框的保存和修改
      onSubmitInput() {
        if (this.searchOperate == null || this.searchOperate.trim() == "") {
          this.$message.warning("运算公式不可为空！");
          this.isButtonDisabled = true;
          return;
        } else if (this.formulaJudge(this.searchOperate)) {
          let rowIndex = this.searchOperate.replace(/[^0-9]/gi, "");
          let points = rowIndex.split("");
          points.sort(function (a, b) {
            return b - a;
          });
          if (points[0] > this.tableData.length) {
            this.$message.warning(
              "运算公式中的最大值超过条件个数，请检查后重试！"
            );
            this.isButtonDisabled = true; // 公式不合法时禁用保存按钮
            return;
          }
          this.isButtonEnabled = false;
        } else {
          this.$message.warning("运算公式不合法，请检查后重试！");
          this.isButtonDisabled = true; // 公式不合法时禁用保存按钮
          return;
        }
        this.isButtonDisabled = true; //点击时立即禁用按钮
        const params = {
          userId: store.getters.user_id.toString(),
          userName: store.getters.userName.toString(),
          token: store.getters.token.toString(),
          tagDefineId: this.tagsClickList.id,
          list: [],
          tagOperation: {
            id: this.inputId,
            tagFormula: this.searchOperate,
          },
        };
        this.tableData.forEach((item) => {
          const listItem = {
            tagSort: item.tagSort,
            tabName: item.tabName,
            tagField: item.tagField,
            tagOperator: item.tagOperator,
            tagCondition: item.tagCondition,
          };
          params.list.push(listItem); // 将当前行数据添加到list数组中
        });
        saveTagRequirementEdit(params).then((res) => {
          if (res.result) {
            this.$message({
              message: "操作成功",
              type: "success",
            });
            this.getTableList();
          }
          this.timer = setTimeout(() => {
            this.isButtonDisabled = false; // 启用按钮
            clearTimeout(this.timer); // 清除定时器
          }, 2000);
        });
      },
      // 添加成功或者编辑成功，回调方法
      handleGroupAddSuccess(e) {
        const { type, data } = e;
        if (type === 1) {
          // 新增分组
          this.tagGroups.push(data);
          // 计算新添加分组的索引
          let index = this.tagGroups.length - 1;
          this.handleGroupClick(data, index);
        } else if (type === 2) {
          // 新增分类
          this.categories.push(data);
          let index = this.categories.length - 1;
          this.handleNodeClick(data, index);
          // this.handleGroupClick(data, index);
        } else if (type === 3) {
          this.tags.push(data);
          let index = this.tags.length - 1;
          this.handleTagClick(data, index);
        }
      },
    },
  };
  </script>
  <style scoped>
  .consult {
    width: 100%;
    height: 100%;
    background-color: #ffffff;
  }
  >>> .el-tree-node__content {
    display: flex;
    align-items: center;
    height: 3.354vw;
    border: 1px solid #eee;
    cursor: pointer;
  }
  >>> .el-tree {
    height: calc(100vh - 260px);
    overflow-y: scroll;
  }
  >>> .custom-tree-node {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
  }
  .tagGroup ul {
    list-style: none;
  }
  
  .tagGroup ul li {
    padding: 20px;
    border-bottom: 1px solid #eee;
  }
  
  .tagGroup ul li span.ellipsis-text {
    display: inline-block;
    width: 80px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .active {
    /* background: #ecf5ff;
    color: #409eff; */
    background: #cfe5fc;
    color: #000;
  }
  >>> .el-card__header {
    background: linear-gradient(180deg, #fff, #ededed);
  }
  >>> .el-card__body {
    padding: 0;
    height: calc(100vh - 200px);
    overflow-y: auto;
  }
  .person {
    display: none;
  }
  .team {
    display: none;
  }
  .personTable {
    display: none;
  }
  .teamTable {
    display: none;
  }
  </style>